<template id="home">
  <center>
    <Header></Header>
    <div style="width: 1520px;height: auto;">
      <div id="mainbox1">
        <el-carousel trigger="click" height="520px">
          <el-carousel-item>
            <img src="https://www.ketangpai.com/Public/Home/img/home-swiper/banner8.png?v=158">
          </el-carousel-item>
          <el-carousel-item>
            <img src="https://www.ketangpai.com/Public/Home/img/home-swiper/banner1.png?v=158">
          </el-carousel-item>
          <el-carousel-item>
            <img src="https://www.ketangpai.com/Public/Home/img/home-swiper/banner6.png?v=158">
          </el-carousel-item>
          <el-carousel-item>
            <img src="https://www.ketangpai.com/Public/Home/img/home-swiper/banner2.png?v=158">
          </el-carousel-item>
          <el-carousel-item>
            <img src="https://www.ketangpai.com/Public/Home/img/home-swiper/banner4.png?v=158">
          </el-carousel-item>
          <el-carousel-item>
            <img src="https://www.ketangpai.com/Public/Home/img/home-swiper/banner3.png?v=158">
          </el-carousel-item>
        </el-carousel>
      </div>


      <div class="mainbox2">
        <div class="mainbox2-box1">
          <h2>【专家报告视频会】钟南山、李兰娟、张文宏同台指导学校疫情防控工作</h2>
          <p>4月20日下午3点，教育部召开学校疫情防控专家报告视频会，会议深入贯彻习近平总书记重要指示批示精神和党中央、国务院决策部署，指导各地各校全面做好学校疫情防控工作…<a
            href="https://mp.weixin.qq.com/s/dGMZOYUzk0cKnIZRirr1AA" style="text-decoration: none;">>>查看内容</a></p>
          <div>
            <video style="width: 900px;height: 500px;" controls preload="auto"
                   src="https://assets.ketangpai.com/20200420/0420yiqingedu.mp4"></video>
          </div>
        </div>
        <div class="mainbox2-box2">
          <div>
            <img src="https://www.ketangpai.com/Public/Home/img/summary/Whome1.png">
            <h2>极简教学主义</h2>
            <p>无安装，无插件，无需专门学习；掌握简单，三分钟上手；不改变教学习惯，让课堂更精彩，让教学更高效！</p>
          </div>
          <div>
            <img src="https://www.ketangpai.com/Public/Home/img/summary/Whome2.png">
            <h2>远程直播互动教学</h2>
            <p>一键开启直播，共享电脑屏幕，替代教室投影仪/黑板，像在教室里一样互动教学。直播录像自动保存，可查看课堂直播教学统计和再次回顾学习。</p>
          </div>
          <div>
            <img src="https://www.ketangpai.com/Public/Home/img/summary/Whome3.png">
            <h2>有趣的课堂互动</h2>
            <p>提供丰富的教学互动创新场景，上传原生PPT课件进行讲解，手机遥控，标记疑问，评论，开启弹幕，抢答，提问，讨论，随时奖励学生表现，让课堂更精彩。</p>
          </div>
          <div>
            <img src="https://www.ketangpai.com/Public/Home/img/summary/Whome4.png">
            <h2>随堂互动答题</h2>
            <p>随时编辑互动答题：投票、评价、匿名开放、拍照、选择、判断、简答等多种题型，实时分析互动答题情况，一键词云提取学生有效观点，及时检验教学效果
            </p>
          </div>
          <div>
            <img src="https://www.ketangpai.com/Public/Home/img/summary/Whome5.png">
            <h2>精准的考勤签到</h2>
            <p>二维码，数字口令，GPS，传统考勤等多种考勤形式；杜绝代签，一键导出考勤记录</p>
          </div>
          <div>
            <img src="https://www.ketangpai.com/Public/Home/img/summary/Whome6.png">
            <h2>作业神器</h2>
            <p>81种文档格式作业在线展示和批阅，随时随地批改作业；实时查重，精准比对，避免学生抄袭；自动管理成绩，一键下载作业数据</p>
          </div>
          <div>
            <img src="https://www.ketangpai.com/Public/Home/img/summary/Whome7.png">
            <h2>智能成绩管理</h2>
            <p>汇总考勤、表现、作业、测试、平时成绩、期末成绩；自由调整成绩权重，汇总最终教学成绩，科学权威</p>
          </div>
          <div>
            <img src="https://www.ketangpai.com/Public/Home/img/summary/Whome8.png">
            <h2>教学全过程数据分析</h2>
            <p>教学全过程活动数据自动生成，实时查看课程和学生数据面板和报表，教学数据可留存，可追溯</p>
          </div>
        </div>
        >
      </div>
      <div class="mainbox3">
        <div>
          <img style="float: left;" src="https://www.ketangpai.com/Public/Home/img/summary/s2.png">
        </div>
        <div style="width: 400px;height: 380px;text-align: left;margin-top: 100px;float: left;">
          <img width="54px" height="36px" src="https://www.ketangpai.com/Public/Home/img/summary/wdian.png">
          <h2 style="font-size: 35px;color: blue;">
            远程直播，在线互动教学</h2>
          <ul style="font-size: 20px;">
            <li>无安装，操作简单</li>
            <li>在线实时互动，全过程教学统计</li>
            <li>自动录播，再次回顾，保留教学资产</li>
          </ul>
        </div>
      </div>
      <div class="mainbox4">
        <div style="width: 500px;float: left;color: white;margin-left: 200px;text-align: left;font-size: larger;">
          <img width="54px" height="36px" src="https://www.ketangpai.com/Public/Home/img/summary/wWhited.png">
          <h1>精品课程，在线自主学习</h1>
          <p>北大领航，集高校精品课程，免费向社会开放，惠及全球华人课堂派教学资源互相共享，打造线上金课，混合金课，共建金课</p>
        </div>
        <div style="float: left;top: 0px;position: absolute;left: 900px;">
          <img style="margin-top: 0px;padding-top: 0px;"
               src="https://www.ketangpai.com/Public/Home/img/summary/s3r.png">
        </div>
      </div>
      <div class="mainbox5">
        <div>
          <img style="float: left;" src="https://www.ketangpai.com/Public/Home/img/summary/s4l.png">
        </div>
        <div style="width: 500px;height: 380px;text-align: left;margin-top: 100px;float: left;margin-left: 100px;">
          <img width="54px" height="36px" src="https://www.ketangpai.com/Public/Home/img/summary/wdian.png">
          <h2 style="font-size: 35px;color: blue;">
            混合教学，全过程管理</h2>
          <ul>
            <li><span style="font-weight: 700;flex: 0 0 95px;width: 95px;">课前备课：</span><span>创建课堂，轻松开启教学，发布预习</span>
            </li>
            <li><span style="font-weight: 700;flex: 0 0 95px;width: 95px;">课中互动：</span><span>上传原生课件，随堂互动答题，提供多种互动创新场景，让课堂活起来</span>
            </li>
            <li><span style="font-weight: 700;flex: 0 0 95px;width: 95px;">课后巩固：</span><span>随时随地发布话题，测试，作业，在线批阅，实时查重，自动管理教学成绩，教学过程自动分析，可留存，可追溯</span>
            </li>
          </ul>
        </div>
      </div>
      <div class="mainbox6">
        <h1 style="font-weight: 400;font-size: 40px;">媒体报道</h1>
        <p style="opacity: 0.6;font-size: larger;">课堂派深耕教学管理，受到广泛认可</p>
        <el-carousel :interval="40000000" type="card" height="320px" trigger="click">
          <!--        <div class="mainbox6-blue">-->
          <el-carousel-item style="background-color: white;text-align: left;padding: 40px;width: 700px;float: left">
            <h2>助力智慧课堂：课堂派成为腾讯微校生态战略伙伴</h2>
            <p>
              7月18日，腾讯微校发布会在北京船山书院如期举行，正式推出以微信校园卡、腾讯校园码为核心的数字校园解决方案——腾讯微校2.0。本次发布会突破传统Q&A的传统模式，现场模拟校园场景，利用“一款非常好用的应用”课堂派进行了现场互动。作为腾讯微校的生态战略伙伴，互动教学品牌课堂派展现了科技时代，智慧课堂所带来的创新和变</p>
            <button
              style="width: 120px;height: 50px;background-color: #569fe0;font-size: 15px;border: none;color: white;border-radius: 2px">
              查看详情
            </button>
          </el-carousel-item>
          <!--          <span style="float: left;width: 15px;height: 200px;background-color: blue"></span>-->
          <!--          <div>-->
          <el-carousel-item style="background-color: white;text-align: left;padding: 40px;width: 700px">
            <h2>课堂派亮相2018中国“互联网+”数字经济峰会</h2>
            <p>
              4月12日下午教育分论坛，北京大学软件与微电子学院林院长分享了智慧课堂的建设经验：教学资源呈现多样化、课堂形式丰富、如何把学生从玩手机的屏幕聚焦到课堂互动环节等方面。林院长表示，课堂派在研发过程中，学院的一线教师主动参与，把很多丰富的实际教学经验融入研发当中，使整个智慧课堂的建设更具实用性和前瞻性。</p>
            <button
              style="width: 120px;height: 50px;background-color: #569fe0;font-size: 15px;border: none;color: white;border-radius: 2px">
              查看详情
            </button>
          </el-carousel-item>
          <el-carousel-item style="background-color: white;text-align: left;padding: 40px;width: 700px">
            <h2>新时代新青年 课堂派创始人陈杰宾的创业梦</h2>
            <p>
              6月26日，中国共产主义青年团第十八次全国代表大会在人民大会堂开幕。共青团委对福建省驻京团工委点赞，CCTV新闻频道进行了同步报道。分享会上，课堂派创始人陈杰宾作为闽籍创业青年代表，向在京青年创业者分享了课堂派的发展模式以及创业历程</p>
            <button
              style="width: 120px;height: 50px;background-color: #569fe0;font-size: 15px;border: none;color: white;border-radius: 2px">
              查看详情
            </button>
          </el-carousel-item>
          <el-carousel-item style="background-color: white;text-align: left;padding: 40px;width: 700px">
            <h2>【新浪新闻】课堂派云管理颠覆高校传统实习模式</h2>
            <p>用课堂派最大的好处就是在学习的过程中，随时跟老师进行沟通和分享，无论从知识和情感层面都需要倾诉，而课堂派不仅提供跟老师同学交流的机会，还能够获得别人的指导和鼓励，让整个学习过程更加轻松。</p>
            <button
              style="width: 120px;height: 50px;background-color: #569fe0;font-size: 15px;border: none;color: white;border-radius: 2px">
              查看详情
            </button>
          </el-carousel-item>
          <el-carousel-item style="background-color: white;text-align: left;padding: 40px;width: 700px">
            <h2>【华北电力大学】“互联网+”让教育发现每一个学生</h2>
            <p>“课堂上教师要及时了解学生对内容的掌握程度，课下学生也希望教师能对自己的学习困难进行及时的指导。”在以前，这些实现起来比较困难的事情，“课堂派”可以让这一切变得轻而易举。</p>
            <button
              style="width: 120px;height: 50px;background-color: #569fe0;font-size: 15px;border: none;color: white;border-radius: 2px">
              查看详情
            </button>
          </el-carousel-item>
          <el-carousel-item style="background-color: white;text-align: left;padding: 40px;width: 700px">
            <h2>【网易教育】课堂派：教师指向型在线教育平台新思路</h2>
            <p>目前，教育资源渐趋雷同并竞相抢占市场份额，在线教育发展进入瓶颈期。可喜的是，课堂派的出现打破了这一随大流的现有局面，致力于教师指向型在线教育平台开发，为在线教育市场发展提出新思路</p>
            <button
              style="width: 120px;height: 50px;background-color: #569fe0;font-size: 15px;border: none;color: white;border-radius: 2px">
              查看详情
            </button>
          </el-carousel-item>
        </el-carousel>
      </div>
      <div class="mainbox7">
        <h1><span style="color: blue;">6000+</span>学校正在使用课堂派</h1>
        <div class="allschool">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/1.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/2.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/3.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/4.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/5.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/6.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/7.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/8.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/9.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/10.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/11.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/12.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/13.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/14.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/15.png">
          <img src="https://www.ketangpai.com/Public/Home/img/slogo/newSlogo/16.png">

        </div>
      </div>
    </div>
    <Footer1></Footer1>
  </center>
</template>

<script>
  import '../../assets/style.css'
  import Header from "../../components/Header";
  import Footer1 from "../../components/Footer1";

  export default {
    name: "Home",
    data() {
      return {
        imges: document.querySelectorAll("#i img"),
      }
    },
    components: {
      Header,
      Footer1,
    },
    methods: {}
  }
</script>

<style scoped>
  #mainbox1 .el-carousel__indicators--horizontal {
    bottom: 50px !important;
  }
</style>
<style>
  #mainbox1 .el-carousel__indicators--horizontal {
    bottom: 50px !important;
  }

  #mainbox1 .el-carousel__button {
    width: 35px;
    height: 5px;
  }

  #mainbox1 .el-carousel__arrow {
    display: none !important;
  }

  .mainbox6 .is-in-stage {
    opacity: 0.5;
  }

  .mainbox6 .el-carousel__item.is-active {
    opacity: 1;
  }

  .mainbox6 .el-carousel--horizontal {
    overflow-x: visible;
  }

  .mainbox6 .el-carousel__indicators--outside {
    position: absolute;
    bottom: -120px;
  }

  .mainbox6 .el-carousel__button {
    width: 10px;
    height: 10px;
    border-radius: 10px;
  }

  .mainbox6 .el-carousel__arrow--left {
    left: 290px;
  }

  .mainbox6 .el-carousel__arrow--right {
    right: 250px;
  }

  .mainbox6 h2 {
    font-weight: 400;
    margin-bottom: 50px;
  }

  .mainbox6 .is-in-stage p {
    margin-bottom: 70px;
  }

  .mainbox6-blue {
    width: 800px;
  }

  .is-active > .el-carousel__button {
    width: 30px !important;
  }
</style>
